<template>
  <div class="container1">
    <GoobalHeader :user="currentUser"></GoobalHeader>
   <router-view></router-view>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import "bootstrap/dist/css/bootstrap.min.css";
import ColumnList, { ColumnProps } from "@/components/ColumnList.vue";
import GoobalHeader, { UserProps } from "@/components/GlobalHeader.vue";
import Login from "@/views/Login.vue";

const currentUser: UserProps = {
  isLogin: true,
  name: "司天宏",
  nickName: "上帝"
};
const testData: ColumnProps[] = [
  {
    id: 1,
    title: "test1的专栏",
    description: "描述"
  }, {
    id: 2,
    title: "test2的专栏",
    description: "描述"
  }
];
export default defineComponent({
  name: "App",
  components: {
    ColumnList,
    GoobalHeader,
    Login
  },

  setup() {
    return {
      list: testData,
      currentUser
    };
  }
});
</script>

<style scoped>
.card-body img {
  width: 50px;
  height: 50px;
}

.container1 {
}
</style>
